How To Hide And Show Check Box Using Flutter Android

admin_img Posted By Bajarangi soft , Posted On 27-11-2020

In flutter there is a specific widget named as Visibility which is used hide any given child widget using Boolean true false values. We can easily maintain Boolean value using State. Sometimes app developer wants to hide ListView or any other components like Text, Container, TextField etc on button click event.

How To Hide And Show Check Box Using Flutter Android

Hide And Show Check Box
Complete Code For Hide And Show Check Box In Flutter
main.dart

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.red,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  bool _isCheckBoxVisible = true;
  bool _isChecked = true;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.lightGreen[900],
        title: Text("Hide And Show CheckBox"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          mainAxisSize: MainAxisSize.max,
          children: <Widget>[
            _isCheckBoxVisible
                ? CheckboxListTile(
              value: _isChecked,
              onChanged: (val) => setState(() => _isChecked = val),
              title: Text("Check Box Text"),
            )
                : SizedBox(),
            SizedBox(height: 30.0),
            RaisedButton(
              color: Colors.lightGreen[900],
              textColor: Colors.white,
              child: Text(_isCheckBoxVisible ? "Hide" : "Show"),
              onPressed: () {
                setState(() => _isCheckBoxVisible = !_isCheckBoxVisible);
              },
            ),
          ],
        ),
      ),
    );
  }
}

Related Post